<template>
  <div class="app-container">
    <div v-if="userInfo">
      <el-row :gutter="20">
        <el-col :span="5" :xs="24">
          <user-card :user="userInfo" />
        </el-col>
        <el-col :span="19" :xs="24">
          <el-card>
            <el-tabs v-model="activeTab">
              <el-tab-pane label="基本信息" name="account">
                <account :user="userInfo" :shopgetinfo='shopgetinfo'/>
              </el-tab-pane>

              <el-tab-pane label="商户资料" name="security">
                <security :user="userInfo" :shipping-date="shippingDate" :bankInformation='shopgetinfo' />
              </el-tab-pane>

              <el-tab-pane label="订单设置" name="setUp">
                <set-up ref="setUpRef" :user="userInfo"  :shipping-date="shippingDate" />
              </el-tab-pane>
               <el-tab-pane label="打印机设置" name="printer" >
                <printer></printer>
              </el-tab-pane>
              <el-tab-pane label="店铺装修" name="shopDecoration">
                <shopDecoration :shopgetinfo='shopgetinfo'></shopDecoration>
              </el-tab-pane>
            </el-tabs>
          </el-card>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import UserCard from './components/UserCard'
import Security from './components/Security'
import Account from './components/Account'
import SetUp from './components/SetUp'
import printer from './components/printer'
import message from './components/message'
import bankmessa from './components/bankmessa'
import shopDecoration from './components/shopDecoration'
import { getInfo } from '@/api/sysSetUp'
import {	getInfo as getMchInfo,	} from "@/api/sysMch";

export default {
  name: 'SysSetUp',
  components: { UserCard, Security, Account, SetUp,printer,message,bankmessa,shopDecoration},
  data() {
    return {
      userInfo: {},
      activeTab: 'account',
      shippingDate: [],
      shopgetinfo:{}
    }
  },
  computed: {
    ...mapGetters([
      'name',
      'avatar'
    ])
  },
  created() {
    this.getInfo()
    this.shopinfo()
  },

methods: {
    shopinfo(){
      getMchInfo().then(resposan=>{
         this.shopgetinfo=resposan.data
      })
    },
    getInfo() {
      getInfo().then(res => {
        this.userInfo = res.data
        this.shippingDate = JSON.parse(this.userInfo.shippingConfig)
        if (this.userInfo.logo == null) {
          this.userInfo.logo = 'https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png'
        }
      }).catch(err => {
        console.log(err)
      })
    },

  }
}
</script>
